<template>
  <div v-loading="loading">
    <div class="state_main">
      <!-- <span style="font-size: 18px">{{ '审核状态:' }}</span> -->
      <!-- 0未审核；1审核中；2审核完成；3回调完成；4配额不足； -->
      <div v-if="fileExamineRecord == null || fileExamineRecord.status == null || fileExamineRecord.status === '0'" class="state" style="color:#909399;">
        <i class="iconfont icon-tishi-mianxing" />
        <p>{{ '未审核' }}</p>
      </div>
      <div v-else-if="fileExamineRecord.status === '1'" class="state" style="color:#E6A23C;">
        <i class="iconfont icon-shijian-mianxing" />
        <p>{{ '审核中' }}</p>
      </div>
      <div v-else-if="fileExamineRecord.status === '2'" class="state" style="color:#67C23A;">
        <i class="iconfont icon-zhengque-mianxing" />
        <p>{{ '审核完成' }}</p>
      </div>
      <div v-else-if="fileExamineRecord.status === '4'" class="state" style="color:#fa8c16;">
        <i class="iconfont icon-zhengque-mianxing" />
        <p>{{ '配额不足' }}</p>
      </div>
    </div>
    <div slot="footer" class="dialog-footer" style="text-align: center;">
      <!-- <el-buton class="el-button el-button--default" @click="$parent.$parent.examineOpen = false">{{ $t('取消') }}</el-buton> -->
      <!-- <el-button v-if="fileExamineRecord.status == null || fileExamineRecord.status === '0'" size="mini" type="text" @click="startAudit">{{ $t('开始审核') }}</el-button> -->
      <!-- <el-button v-if="fileExamineRecord.status === '1'" size="mini" type="text" @click="queryResults">{{ $t('查询结果') }}</el-button> -->
      <el-button v-if="fileExamineRecord.status === '2'" size="mini" type="text" @click="resultDownload">{{ $t('下载结果') }}</el-button>
    </div>
  </div>
</template>

<script>
import { docReview, getDocReviewResult } from '@/api/file/fileBase.js'
import { getToken } from '@/utils/auth'
export default {
  name: 'FileTag',
  data() {
    return {
      fileExamineRecord: {
        id: undefined,
        fileId: undefined,
        openId: undefined,
        status: undefined,
        statusName: undefined,
        commentFileUrl: undefined
      },
      fileBaseId: undefined,
      loading: false
    }
  },
  mounted() {
    this.queryResults()
    setInterval(() => {
      if (this.fileExamineRecord.status !== '2') {
        this.queryResults()
      }
    }, 1000)
  },
  methods: {
    init(data) {
      this.loading = true
      const token = getToken()
      docReview(data.id, token).then(response => {
        if (response.code === 200) {
          this.fileExamineRecord = response.data
          console.log('文档审核调用返回结果', response)
        } else {
          this.msgError(response.msg)
        }
        this.loading = false
      })
    },
    // 表单重置
    reset() {
      this.fileExamineRecord = {
        id: undefined,
        fileId: undefined,
        openId: undefined,
        status: undefined,
        statusName: undefined,
        commentFileUrl: undefined,
        remark: undefined,
        createBy: undefined,
        createTime: undefined,
        updateBy: undefined,
        updateTime: undefined,
        delFlag: undefined
      }
    },
    // 开始审核
    // startAudit() {
    //   this.loading = true
    //   const token = getToken()
    //   docReview(this.fileBaseId, token).then(response => {
    //     if (response.code === 200) {
    //       this.fileExamineRecord = response.data
    //       console.log('文档审核调用返回结果', response)
    //     } else {
    //       this.msgError(response.msg)
    //     }
    //     this.loading = false
    //   })
    // },
    // 查询结果
    queryResults() {
      // 根据文件id修改fileTag
      this.loading = true
      getDocReviewResult(this.fileExamineRecord.openId).then(response => {
        if (response.code === 200) {
          this.fileExamineRecord = response.data
          console.log('获取文件审核返回结果数据', response)
        } else {
          this.msgError(response.msg)
        }
        this.loading = false
      })
    },
    // 文件下载
    // resultDownload() {
    //   if (this.fileExamineRecord.commentFileUrl !== null && this.fileExamineRecord.commentFileUrl !== undefined && this.fileExamineRecord.commentFileUrl !== '') {
    //     window.location.href = this.fileExamineRecord.commentFileUrl
    //   }
    // }
    // 文件下载
    resultDownload() {
      const url = this.fileExamineRecord.commentFileUrl
      var docAll = url.substring(url.lastIndexOf('/') + 1)
      var fileName = docAll.substring(0, docAll.lastIndexOf('.') + 1)
      this.downloadFile(url, fileName)
    },
    downloadFile(url, fileName) {
      var x = new XMLHttpRequest()
      x.open('GET', url, true)
      x.responseType = 'blob'
      x.onload = function() {
        var url = window.URL.createObjectURL(x.response)
        var a = document.createElement('a')
        a.href = url
        a.download = fileName
        a.click()
      }
      x.send()
    }

  }
}
</script>

<style lang="scss" scoped>
/deep/ .el-tag + .el-tag {
  margin-left: 10px;
  margin-top: 15px;
}
/deep/ .button-new-tag {
  margin-left: 10px;
  margin-top: 15px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}
// /deep/ . {
//   width: 90px;
//   margin-left: 10px;
//   margin-top: 15px;
//   vertical-align: bottom;
// }
.input-new-tag {
  width: 90px;
  margin-left: 10px;
  margin-top: 15px;
  vertical-align: bottom;
}
.state_main{
  margin: 20px auto 40px;
  text-align: center;
  .state{
    i{
      font-size: 60px;
    }
    p{
      font-weight: bold;
      font-size: 16px;
      margin: 0;
      margin-top: 10px;
    }
  }
}
</style>
